HTML & CSS Essentials For Dummies by Paul McFedries

Author:Paul McFedries [McFedries, Paul]
Language: eng
Format: epub
ISBN: 9781394262915
Publisher: Wiley
Published: 2024-04-01T00:00:00+00:00

Rounding a border

The boxes in the box model are resolutely rectangular, but that doesn’t mean you have to always settle for sharp corners when you add a border around an element. To give your borders a softer look, you can round them using the border-radius property, which can round one or more corners based on the arc of either a circle or an ellipse.

The most common and most straightforward way to round an element’s border corners is to base the rounding on the arc of a circle with a specified radius. Here’s the border-radius syntax to use for this case:

selector {

border-radius: radius;

}

The various parts of this code are as follows:

selector: A CSS selector that specifies the item (or items) you want to style.

radius: A value (expressed on one of the standard CSS measurement units, such as px, em, rem, vw, or vh) or a percentage.

Download

Copyright Disclaimer:
This site does not store any files on its server. We only index and link to content provided by other sites. Please contact the content providers to delete copyright contents if any and email us, we'll remove relevant links or contents immediately.